<template>
    <div class="left">
        <ul>
            <li>
                <img src="../../assets/img/shouyin.png" alt="">
                <div>收银</div>
            </li>
            <li>
                <img src="../../assets/img/dianpu.png" alt="">
                <div>店铺</div>
            </li>
            <li>
                <img src="../../assets/img/shangpin.png" alt="">
                <div>商品</div>
            </li>
            <li>
                <img src="../../assets/img/huiyuan.png" alt="">
                <div>会员</div>
            </li>
            <li>
                <img src="../../assets/img/tongji.png" alt="">
                <div>统计</div>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
    
}
</script>

<style scoped>
ul{
    padding: 0;
    margin: 0;
}
    .left{
        color: #fff;
        height: 100%;
        font-size: 10px;
        background: #1d8ce0;
        float: left;
        width: 5%;
    }
    img{
        position: absolute;
        left: 50%;
        margin-left: -10px;
        width: 20px;
        text-align: center;
        padding-top: 10px;
    }
    li{
        padding: 0;
        margin: 0;
        list-style: none;
        width: 100%;
        height: 60px;
        border-bottom: 1px solid #333;
        position: relative;
    }
    li div{
        text-align: center;
        position: absolute;
        bottom: 10px;
        /* padding: 10px; */
        left: 50%;
        margin-left: -12px;
    }

</style>

